import React,{ Component } from 'react';
import './momentsCard.scss';
import {
	Link
} from 'react-router-dom';
export default class MomentsCard extends Component{
	constructor (props) {
		super(props)
		this.state={
			praise: this.props.companyInfo.praise,
			comment: this.props.companyInfo.comment
		}
	}
	render(){
		return(
			<div className="momentsCard">
				<div><img src={this.props.company_logo} className="momentsCard_img" alt="lalal"/></div>
				<div className="momentsCard_text">
					<p className="momentsCard_title">{this.props.company_name}<span className="momentsCard_name">公司</span></p>
					<div className="momentsCard_content">
						<img src={this.props.companyInfo.news_img} className="momentsCard_img1" alt="lalal"/>
						<p className="momentsCard_p">{this.props.companyInfo.news_title}</p>
					</div>
					<Link to={
						{
							pathname: `${window.baseUrl}/moments/companyDynamic`,
							state: {
								company_news_detail: this.props.companyInfo.company_news_detail
							}
						}
					} className="momentsCard_df">查看详情</Link>
					<p className="momentsCard_time">{this.props.companyInfo.new_create_time}</p>
					{
						this.state.praise.length === 0 && this.state.comment.length === 0 ? '' : <span className="momentsCard_jiao"></span>
					}
					<div className="momentsCard_pinlun">
					{
						this.state.praise.length !== 0 ? 
						<div>
							<i className="glyphicon glyphicon-like"></i>
							{
								this.state.praise.map((item,index) => {
									return(
										<span key={index} style={{marginRight: '0.3rem'}}>{item.praise_by},</span>
									)
								})
							}
						</div> : ''
					}
					{
						this.state.comment.length !== 0 ?
						<div>
						{
							this.state.comment.map((item,index) => {
								return(
									<p className="moments_con" key={index}><span>{item.comment_by}:</span>{item.comment_detail}</p>
								)
							})
						}
						</div> : ''
					}
						
					</div>
				</div>
			</div>
		)
	}
}